<template>
  <div>
    <el-form :model="searchList" ref="searchList">
      <el-row :gutter="20">
        <el-col :span="8" :offset="0">
          <el-form-item label="">
            <el-date-picker v-model="searchList.apply_batch" type="year" value-format="yyyy" size="normal"
              placeholder="选择项目批次" class="wid">
            </el-date-picker>
          </el-form-item>
        </el-col>
        <el-col :span="8" :offset="0">
          <el-form-item label="">
            <el-input v-model="searchList.basket_name"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8" :offset="0">
          <div class="right">
            <el-button type="primary" size="medium" @click="onAdd">新增包组</el-button>
            <el-button type="primary" size="medium" @click="search" :loading="loading">查询</el-button>
          </div>
        </el-col>
      </el-row>
    </el-form>

    <el-table :data="tableData.results" border stripe :height="offsetHeight" v-loading="loading" ref="tableData">
      <el-table-column type="index" label="序号" width="80" align="center">
      </el-table-column>
      <el-table-column prop="basket_name" label="审核包组名称" align="center">
      </el-table-column>
      <el-table-column prop="check_login_name" label="咨询机构名称" align="center">
      </el-table-column>
      <el-table-column prop="num" label="项目数量" width="80" align="center">
      </el-table-column>
      <el-table-column prop="service_pre_amount" label="申请金额" width="100" align="center">
      </el-table-column>
      <el-table-column prop="basket_status" label="包组状态" width="80" align="center">
      </el-table-column>
      <el-table-column label="操作" width="400" align="center">
        <template slot-scope="{row}">
          <el-button-group>
            <template v-if="row.basket_status !== '已同步'">
              <el-button type="primary" size="mini" @click="edit(row)">修改</el-button>
              <el-button type="danger" size="mini" @click="remove(row.id)">删除</el-button>
              <el-button type="success" size="mini" @click="choose(row.id)">抽取咨询机构
              </el-button>
              <el-button type="green" size="mini" @click="onSync(row.id)">同步</el-button>
            </template>
            <el-button type="primary" size="mini" @click="unitInfo(row)">查看包含单位</el-button>
          </el-button-group>
        </template>
      </el-table-column>
    </el-table>
    <div class="page">
      <el-pagination @size-change="pageSizeChange" @current-change="pageNoChange" :page-sizes="[10, 50, 100, 200]"
        :page-size="10" background layout="total, sizes, prev, pager, next" :total="tableData.totalRecord">
      </el-pagination>
    </div>
    <!-- 包组名称 -->
    <el-dialog title="包组信息" :visible.sync="packageShow" width="30%" @close="cancel">
      <el-form :model="packageParams" ref="packageParams" size="normal">
        <el-form-item label="">
          <el-input v-model="packageParams.basket_name" placeholder="请输入包组名称"></el-input>
        </el-form-item>
      </el-form>
      <span slot="footer">
        <el-button type="danger" @click="cancel">取消</el-button>
        <el-button type="primary" @click="addPack" :loading="saveLoading" v-if="!packageParams.id">新增</el-button>
        <el-button type="primary" @click="editPack" :loading="saveLoading" v-else>修改</el-button>
      </span>
    </el-dialog>
    <!-- 咨询机构抽取 -->
    <el-dialog title="抽取咨询机构" :visible.sync="chooseShow" width="40%" @close="cancel">
      <el-form :model="chooseParams" ref="chooseParams" size="normal">
        <el-form-item label="不参加的审核机构">
          <el-select v-model="chooseParams.exclude_codes" multiple placeholder="请输入包组名称" class="wid">
            <el-option v-for="item in chooseType" :key="item.value" :label="item.label" :value="item.value">
            </el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <span slot="footer">
        <el-button type="danger" @click="cancel">取消</el-button>
        <el-button type="primary" @click="chooseThird" :loading="saveLoading">确定</el-button>
      </span>
    </el-dialog>
  </div>
</template>
<script>
export default {
  name: 'PickPackage',
  components: {

  },
  props: {

  },
  data () {
    return {
      loading: false,
      searchList: {},
      tableData: [],
      offsetHeight: document.documentElement.clientHeight - 280,
      pageNo: '1',
      pageSize: '10',
      packageShow: false,
      packageParams: {},
      chooseShow: false,
      chooseParams: {},
      chooseType: [],
      saveLoading: false,
    }
  },
  created () {

  },
  mounted () {
    this.init()
  },
  methods: {
    async init () {
      this.loading = true
      const res = await this.$http('verifyPickPage', {
        pageNo: this.pageNo,
        pageSize: this.pageSize,
        ...this.searchList
      })
      this.tableData = res
      this.loading = false
    },
    search () {
      this.pageNo = '1'
      this.pageSize = '10'
      this.init()
    },
    onAdd () {
      this.packageParams = {}
      this.packageShow = true
    },
    async addPack () {
      if (!this.packageParams.basket_name) {
        this.$tips.error('请填写正确的包组名')
        return
      }
      this.saveLoading = true
      const res = await this.$http('verifyPickAdd', {
        basket_name: this.packageParams.basket_name
      })
      this.tableData = res
      this.$tips.success(res.errmsg)
      this.saveLoading = false
      this.cancel()
      this.init()
    },
    cancel () {
      this.packageShow = false
      this.chooseShow = false
      this.packageParams = {}
      this.chooseParams = {}
    },
    edit (item) {
      this.packageParams = {
        id: item.id,
        basket_name: item.basket_name
      }
      this.packageShow = true
    },
    async editPack () {
      if (!this.packageParams.basket_name) {
        this.$tips.error('请填写正确的包组名')
        return
      }
      this.saveLoading = true
      const res = await this.$http('verifyPickUp', {
        id: this.packageParams.id,
        basket_name: this.packageParams.basket_name
      })
      this.tableData = res
      this.$tips.success(res.errmsg)
      this.saveLoading = false
      this.cancel()
      this.init()
    },
    remove (id) {
      this.$confirm('是否确认删除?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.remove1(id)
      }).catch(() => {

      });
    },
    async remove1 (id) {
      this.loading = true
      const res = await this.$http('verifyPickDel', {
        id: id
      })
      this.tableData = res
      this.$tips.success(res.errmsg)
      this.init()
    },
    unitInfo (item) {
      let params = {
        id: item.id,
        basket_status: item.basket_status
      }
      this.$emit('unitInfo', params);
    },
    async choose (id) {
      const res = await this.$http('sysThirdList', {
        check_flag: 0
      })
      this.chooseType = []
      res.forEach(item => {
        if (item.check_flag === '0') {
          this.chooseType.push({ value: item.code, label: item.name })
        }
      })
      this.chooseParams = {
        id: id
      }
      this.chooseShow = true
    },
    chooseThird () {
      this.$confirm('是否确认随机咨询机构?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.saveLoading = true
        this.chooseThird1()
      }).catch(() => {

      });
    },
    async chooseThird1 () {
      const res = await this.$http('verifyPickRandom', {
        ...this.chooseParams
      })
      this.$tips.success(res.errmsg)
      this.saveLoading = false
      this.cancel()
      this.init()
    },
    onSync (id) {
      this.$confirm('是否确认同步?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.onSync1(id)
      }).catch(() => {

      });
    },
    async onSync1 (id) {
      this.loading = true
      const res = await this.$http('verifyPickSync', {
        id: id
      })
      this.$tips.success(res.errmsg)
      this.init()
    },
    // table分页
    pageNoChange (pageNo) {
      this.pageNo = pageNo
      this.init()
    },
    pageSizeChange (pageSize) {
      this.pageSize = pageSize
      this.init()
    }
  },
  computed: {

  }
}
</script>
<style lang='scss' scoped>
</style>
